<template>
  <div class="container">
    <Item v-for="item of movies" :data="item" :key="item.id"  @click.native="handleMovies(item._id)"></Item>
    
  </div>
</template>

<script>
export default {
  name:"App",
  data(){
    return{
      movies:[],
      id:""
    }
  },
  mounted() {
    this.$http.get("http://47.108.197.28:4000/api/movie/top250").then((res)=>{
      res.data.res.forEach(item=>{
        var {pic}=item;
        item.img=pic;
        
      })
      this.movies=res.data.res

    })
  },
  methods: {
    handleMovies(val){
      // console.log(val);
      var id = val;
      this.$router.push(`/movieDetail/${id}`)
  
    }
  },
}
</script>

<style>

</style>